<template>
    <div class="buildingNode_building">
        <el-breadcrumb separator="/" class="bread-title">
            <el-breadcrumb-item :to="{ path: '/buildingNode' }">楼盘节点管理</el-breadcrumb-item>
            <el-breadcrumb-item>查看楼盘</el-breadcrumb-item>
        </el-breadcrumb>
        {{nodeName}}
        <hr>
        <el-form :inline="true" class="demo-form-inline">
            <el-form-item label="城市：">
                <el-select v-model="city" placeholder="城市" size="small" @change="cityChangeHandle" filterable>
                    <el-option v-for="(item,index) in cityList" :key="index" :label="item.city" :value="item.cityId">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="楼盘名称：">
                <el-select v-model="devId" placeholder="楼盘名称" size="small" filterable>
                    <el-option v-for="(item,index) in devList" :key="index" :label="item.devName" :value="item.devId">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="success" size="small" @click="searchHandle" id="monitorEnter">查询</el-button>
            </el-form-item>
        </el-form>
        <el-table :data="tableData" border>
            <el-table-column type="index" label="序号" width="50"></el-table-column>
            <el-table-column prop="city" label="城市"></el-table-column>
            <el-table-column prop="devName" label="楼盘名称"></el-table-column>
            <el-table-column prop="estateProjectId" label="项目ID"></el-table-column>
            <el-table-column prop="devId" label="楼盘ID"></el-table-column>
        </el-table>
        <div class="pagebar">
            <el-pagination
                    background
                    layout="total, sizes, prev, pager, next"
                    :current-page.sync="currentPage"
                    :page-sizes="[10, 20, 30, 40]"
                    :page-size="pageSize"
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :total="totalSize">
            </el-pagination>
        </div>
    </div>
</template>

<script>

export default {
    name:"buildingNode_building",
    created() {
        // 查楼盘列表
        this.nodeId = this.$route.query.nodeId
        this.nodeName = this.$route.query.nodeName
        this.searchList()
        this.$axios.post('/city/cityList').then((res) => {
            this.cityList=res.cityList;
            this.cityList.unshift({cityId: undefined, city: '全部'})
        });
    },
    mounted() {},
    components: {},
    data() {
        return {
            nodeId: '',
            nodeName: '',
            city: undefined,
            devId: undefined,
            cityList: [],
            devList: [],
            tableData: [],
            currentPage: 1,
            pageSize: 10,
            totalSize: 0,
        }
    },
    methods: {
        // 城市改变时
        cityChangeHandle (val) {
            this.devId = undefined
            this.city = val
            this.$axios.post('/estate/devs/select/mapParam',{cityId: this.city}).then(res => {
                let result = res
                result.unshift({devId: undefined,devName:"楼盘名称"})
                this.devList = result;
            });
        },
        searchHandle(){
            this.currentPage = 1
            this.searchList()
        },
        searchList () {
            let param = {}
            param.id = this.nodeId
            param.cityId = this.city
            param.devId = this.devId
            param.pageSize=this.pageSize
            param.pageNum = this.currentPage
            this.$axios.post('/estate/node/getDevInfos',param).then((res) => {
                this.tableData = res.datas
                this.totalSize = res.total
            });
        },
        // 分页器改变页码
        handleCurrentChange () {
            this.searchList()
        },
        handleSizeChange (val) {
            this.pageSize = val
            this.searchList()
        },
    },
    computed: {}
}
</script>
<style lang="stylus" scoped>
    .buildingNode_building {
        
    }
</style>